<template>
  <view class="demo-container">
    <!-- 登录界面 -->
    <view v-if="!isLoggedIn" class="login-container">
      <view class="logo">
        <text class="logo-text">🤖</text>
        <text class="app-name">个人助手</text>
      </view>
      
      <view class="login-content">
        <view class="login-wx">
          <image class="wechat-icon" src="/static/wechat.png" mode="aspectFit"></image>
          <text class="login-text">微信账号一键登录</text>
        </view>
        
        <text class="login-desc">
          个人助手将帮助你管理日程、记录笔记、
          共享文件，打造专属于你的智能生活空间。
        </text>
        
        <button class="btn primary" @tap="handleWechatLogin">
          微信授权登录
        </button>
        
        <text class="permissions-hint">登录后可使用更多功能</text>
      </view>
    </view>
    
    <!-- 主应用界面 -->
    <view v-else class="app-container">
      <!-- 顶部栏 -->
      <view class="header">
        <text class="header-title">个人助手</text>
        <view class="header-actions">
          <view class="action-btn" @tap="openScanCode">
            <text class="action-icon">📷</text>
          </view>
          <view class="user-avatar" @tap="showUserProfile">
            <image :src="avatarUrl" class="avatar-img"></image>
          </view>
        </view>
      </view>
      
      <!-- 内容区域 -->
      <view class="content">
        <!-- 用户信息卡片 -->
        <view class="user-card" @tap="navigateToProfile">
          <image :src="avatarUrl" class="card-avatar"></image>
          <view class="card-info">
            <text class="card-name">{{ nickname }}</text>
            <text class="card-welcome">欢迎回来，今天有什么安排？</text>
          </view>
          <view class="card-arrow">
            <text class="arrow-icon">→</text>
          </view>
        </view>
        
        <!-- 位置信息展示 -->
        <view v-if="currentLocation.address && currentLocation.address !== '获取中...'" class="location-display">
          <view class="location-header">
            <text class="location-icon">📍</text>
            <text class="location-title">当前位置</text>
          </view>
          <text class="location-address">{{ currentLocation.address }}</text>
        </view>
        
        <!-- 权限提示区域 -->
    <view v-if="!hasLocationPermission || !hasCameraPermission" class="permissions-card" @tap="showPermissionGuide">
      <view class="permissions-header">
        <text class="permissions-icon">🔒</text>
        <text class="permissions-title">权限设置</text>
      </view>
      <text class="card-welcome">点击授权位置、相机等权限以获得更好的使用体验</text>
      <text class="permission-btn">前往授权</text>
    </view>

    <!-- 快捷功能 -->
    <view class="shortcuts-section">
      <view class="section-header">
        <text class="section-title">常用功能</text>
      </view>
      <view class="shortcuts-grid">
        <view class="shortcut-item" @tap="requestLocationPermission">
          <view class="shortcut-icon">📍</view>
          <text class="shortcut-name">位置信息</text>
        </view>
        <view class="shortcut-item" @tap="requestCameraPermission">
          <view class="shortcut-icon">📷</view>
          <text class="shortcut-name">相机访问</text>
        </view>
        <view class="shortcut-item" @tap="openContacts">
          <view class="shortcut-icon">👥</view>
          <text class="shortcut-name">联系人</text>
        </view>
        <view class="shortcut-item" @tap="openCalendar">
          <view class="shortcut-icon">📅</view>
          <text class="shortcut-name">日历</text>
        </view>
      </view>
    </view>

    <!-- 功能权限详情区域 -->
    <view class="permissions-card">
      <view class="permissions-header">
        <text class="permissions-icon">⚙️</text>
        <text class="permissions-title">功能权限</text>
      </view>
      <view class="permissions-list">
        <view class="permission-item" @tap="requestLocationPermission">
          <view class="flex items-center">
            <view class="permission-icon">📍</view>
            <view>
              <text class="permission-name">位置信息</text>
              <text class="permission-desc">获取您的当前位置，提供位置相关服务</text>
            </view>
          </view>
          <button class="btn small permission-btn">立即启用</button>
        </view>
        <view class="permission-item" @tap="requestCameraPermission">
          <view class="flex items-center">
            <view class="permission-icon">📷</view>
            <view>
              <text class="permission-name">相机访问</text>
              <text class="permission-desc">允许访问您的相机进行拍照和扫描</text>
            </view>
          </view>
          <button class="btn small permission-btn">立即启用</button>
        </view>
      </view>
    </view>
        
        <!-- 今日日程 -->
        <view class="schedule-section">
          <view class="section-header">
            <text class="section-title">今日日程</text>
            <text class="section-more" @tap="openSchedule">查看全部</text>
          </view>
          <view class="schedule-list">
            <view v-for="(event, index) in todayEvents" :key="index" class="event-item">
              <view class="event-time">
                <text class="event-hour">{{ event.time }}</text>
              </view>
              <view class="event-content">
                <text class="event-title">{{ event.title }}</text>
                <text class="event-location">{{ event.location }}</text>
              </view>
              <view class="event-status" :class="event.status">
                <text class="status-dot"></text>
              </view>
            </view>
          </view>
        </view>

        <!-- 实用工具 -->
        <view class="shortcuts-section">
          <view class="section-header">
            <text class="section-title">实用工具</text>
          </view>
          <view class="shortcuts-grid">
            <view class="shortcut-item" @tap="openNotes">
              <view class="shortcut-icon">📝</view>
              <text class="shortcut-name">备忘录</text>
            </view>
            <view class="shortcut-item" @tap="openFiles">
              <view class="shortcut-icon">📁</view>
              <text class="shortcut-name">文件管理</text>
            </view>
          </view>
        </view>
        
        <!-- 最近文件 -->
        <view class="files-section">
          <view class="section-header">
            <text class="section-title">最近文件</text>
            <text class="section-more" @tap="openFiles">更多</text>
          </view>
          <view class="files-list">
            <view v-for="(file, index) in recentFiles" :key="index" class="file-item" @tap="openFile(file)">
              <view class="file-icon">{{ file.icon }}</view>
              <view class="file-info">
                <text class="file-name">{{ file.name }}</text>
                <text class="file-size">{{ file.size }}</text>
              </view>
              <view class="file-date">{{ file.date }}</view>
            </view>
          </view>
        </view>
        
        <!-- 笔记预览 -->
        <view class="notes-section">
          <view class="section-header">
            <text class="section-title">笔记预览</text>
            <text class="section-more" @tap="openNotes">查看全部</text>
          </view>
          <view class="note-preview" @tap="openNote(notePreview)">
            <text class="note-title">{{ notePreview.title }}</text>
            <text class="note-content">{{ notePreview.content }}</text>
            <text class="note-date">{{ notePreview.date }}</text>
          </view>
        </view>
      </view>
      
      <!-- 底部导航 -->
      <view class="footer-nav">
        <view class="nav-item active">
          <text class="nav-icon">🏠</text>
          <text class="nav-text">首页</text>
        </view>
        <view class="nav-item" @tap="openSchedule">
          <text class="nav-icon">📅</text>
          <text class="nav-text">日程</text>
        </view>
        <view class="nav-item" @tap="openNotes">
          <text class="nav-icon">📝</text>
          <text class="nav-text">笔记</text>
        </view>
        <view class="nav-item" @tap="navigateToProfile">
          <text class="nav-icon">👤</text>
          <text class="nav-text">我的</text>
        </view>
      </view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    // 在数据初始化时就尝试读取本地存储的登录信息
    const loginInfo = uni.getStorageSync('demo_login_info') || {};
    
    return {
      isLoggedIn: !!loginInfo.nickname,
      avatarUrl: loginInfo.avatarUrl || '/static/avatar.svg',
      nickname: loginInfo.nickname || '微信用户',
      hasLocationPermission: loginInfo.hasLocationPermission || false,
      hasCameraPermission: loginInfo.hasCameraPermission || false,
      todayEvents: [
        { time: '10:00', title: '产品设计评审', location: '线上会议', status: 'upcoming' },
        { time: '14:30', title: '前端开发讨论', location: '会议室A', status: 'upcoming' },
        { time: '16:00', title: '周报提交', location: '工位', status: 'completed' }
      ],
      recentFiles: [
        { name: '产品需求文档.docx', size: '2.5MB', date: '今天', icon: '📄' },
        { name: 'UI设计稿.png', size: '4.8MB', date: '昨天', icon: '🖼️' },
        { name: '项目进度表.xlsx', size: '1.2MB', date: '昨天', icon: '📊' }
      ],
      notePreview: {
        title: '小程序开发要点',
        content: '1. 登录授权流程\n2. 权限请求策略\n3. 组件化开发方案\n...',
        date: '今天 10:30'
      },
      // 位置信息
      currentLocation: {
        latitude: 0,
        longitude: 0,
        address: ''
      }
    };
  },
  onLoad() {
    // 检查实际的权限状态（已经在data初始化时读取了登录信息）
    if (this.isLoggedIn) {
      this.checkLocationPermission();
      this.checkCameraPermission();
    }
  },
  methods: {
    // 处理微信登录
    handleWechatLogin() {
      // 先显示加载状态
      uni.showLoading({ title: '登录中...', mask: true });
      
      // 调用微信小程序的登录API获取真实用户信息
      uni.getUserProfile({
        desc: '用于完善用户资料',
        success: (res) => {
          const userInfo = res.userInfo;
          this.isLoggedIn = true;
          this.avatarUrl = userInfo.avatarUrl;
          this.nickname = userInfo.nickName;
          
          // 获取微信登录code，用于后端鉴权
          uni.login({
            success: (loginRes) => {
              if (loginRes.code) {
                console.log('微信登录code:', loginRes.code);
                // 这里可以向后端发送code换取openid和session_key
                // 保存登录信息到本地
                this.updateLoginInfo();
                
                uni.hideLoading();
                uni.showToast({ title: '登录成功' });
                
                // 登录后请求基本权限
                setTimeout(() => {
                  this.showPermissionGuide();
                }, 1000);
              }
            },
            fail: (loginErr) => {
              console.error('微信登录失败:', loginErr);
              uni.hideLoading();
              uni.showToast({ title: '登录失败', icon: 'none' });
            }
          });
        },
        fail: (err) => {
          console.error('获取用户信息失败:', err);
          uni.hideLoading();
          if (err.errMsg.indexOf('auth deny') >= 0) {
            uni.showModal({
              title: '需要授权',
              content: '请允许小程序获取您的基本信息以完成登录',
              showCancel: false
            });
          } else {
            uni.showToast({ title: '登录失败', icon: 'none' });
          }
        }
      });
    },
    
    // 演示登录处理
    handleDemoLogin() {
      // 在真实环境中，此功能应该被删除或禁用
      this.isLoggedIn = true;
      this.avatarUrl = '/static/avatar.svg';
      this.nickname = '演示用户';
      
      // 保存登录信息到本地
      this.updateLoginInfo();
      
      uni.showToast({ title: '演示登录成功' });
    },
    
    // 显示权限引导
    showPermissionGuide() {
      uni.showModal({
        title: '功能权限设置',
        content: '为了更好地使用个人助手的功能，建议授予位置和相机权限。\n\n位置权限：用于日程提醒和地图功能\n相机权限：用于扫码和拍照功能',
        confirmText: '去设置',
        cancelText: '稍后设置',
        success: (res) => {
          if (res.confirm) {
            this.requestLocationPermission();
          }
        }
      });
    },
    
    // 检查位置权限
    checkLocationPermission() {
      uni.getSetting({
        success: (res) => {
          if (res.authSetting['scope.userLocation']) {
            this.hasLocationPermission = true;
            this.getCurrentLocation();
          }
        }
      });
    },
    
    // 检查相机权限
    checkCameraPermission() {
      uni.getSetting({
        success: (res) => {
          if (res.authSetting['scope.camera']) {
            this.hasCameraPermission = true;
          }
        }
      });
    },
    
    // 请求位置权限
    requestLocationPermission() {
      // 调用微信小程序的位置权限请求API
      uni.getLocation({
        type: 'gcj02',
        success: (res) => {
          this.hasLocationPermission = true;
          this.currentLocation = {
            latitude: res.latitude,
            longitude: res.longitude,
            address: '获取中...'
          };
          
          // 调用逆地理编码获取地址
          this.getAddressByLocation(res.latitude, res.longitude);
          
          // 更新本地存储
          this.updateLoginInfo();
          
          uni.showToast({ title: '位置权限已授权' });
        },
        fail: (err) => {
          console.error('获取位置权限失败:', err);
          if (err.errMsg.indexOf('auth deny') >= 0) {
            // 用户拒绝授权，引导用户去设置页面打开权限
            uni.showModal({
              title: '需要位置权限',
              content: '请在手机设置中允许小程序获取您的位置信息',
              success: (modalRes) => {
                if (modalRes.confirm) {
                  uni.openSetting();
                }
              }
            });
          } else {
            uni.showToast({ title: '获取位置权限失败', icon: 'none' });
          }
        }
      });
    },
    
    // 请求相机权限
    requestCameraPermission() {
      // 调用微信小程序的相机权限请求API
      uni.authorize({
        scope: 'scope.camera',
        success: () => {
          this.hasCameraPermission = true;
          // 更新本地存储
          this.updateLoginInfo();
          uni.showToast({ title: '相机权限已授权' });
        },
        fail: (err) => {
          console.error('获取相机权限失败:', err);
          if (err.errMsg.indexOf('auth deny') >= 0) {
            // 用户拒绝授权，引导用户去设置页面打开权限
            uni.showModal({
              title: '需要相机权限',
              content: '请在手机设置中允许小程序获取您的相机权限',
              success: (modalRes) => {
                if (modalRes.confirm) {
                  uni.openSetting();
                }
              }
            });
          } else {
            uni.showToast({ title: '获取相机权限失败', icon: 'none' });
          }
        }
      });
    },
    
    // 获取当前位置
    getCurrentLocation() {
      if (this.hasLocationPermission) {
        uni.getLocation({
          type: 'gcj02',
          success: (res) => {
            this.currentLocation = {
              latitude: res.latitude,
              longitude: res.longitude,
              address: '获取中...'
            };
            
            // 保存位置信息到本地存储，方便其他页面使用
            wx.setStorageSync('currentLocation', this.currentLocation);
            
            // 调用逆地理编码获取地址
            this.getAddressByLocation(res.latitude, res.longitude);
          },
          fail: (err) => {
            console.error('获取位置信息失败:', err);
          }
        });
      }
    },
    
    // 根据经纬度获取地址信息（使用微信小程序的地图API）
    getAddressByLocation(latitude, longitude) {
      uni.request({
        url: `https://apis.map.qq.com/ws/geocoder/v1/?location=${latitude},${longitude}&key=OB4BZ-D4W3U-B7VVO-4PJWW-6TKDJ-WPB77`,
        success: (res) => {
          if (res.data.status === 0) {
            this.currentLocation.address = res.data.result.address;
            // 更新本地存储中的地址信息
            wx.setStorageSync('currentLocation', this.currentLocation);
          }
        },
        fail: (err) => {
          console.error('获取地址信息失败:', err);
        }
      });
    },
    
    // 更新登录信息
    updateLoginInfo() {
      // 从微信登录获取的信息才会有真实的头像和昵称，标记为微信登录
      const isWechatLogin = this.avatarUrl && this.avatarUrl.includes('wx.qlogo.cn');
      
      uni.setStorageSync('demo_login_info', {
        avatarUrl: this.avatarUrl,
        nickname: this.nickname,
        hasLocationPermission: this.hasLocationPermission,
        hasCameraPermission: this.hasCameraPermission,
        isWechatLogin: isWechatLogin,
        wechatNickname: isWechatLogin ? this.nickname : '',
        userId: 'demo-user-' + Math.random().toString(36).substr(2, 8) // 生成临时用户ID
      });
    },
    
    // 显示用户资料
    showUserProfile() {
      uni.showModal({
        title: '个人信息',
        content: `昵称：${this.nickname}\n\n位置权限：${this.hasLocationPermission ? '已授权' : '未授权'}\n相机权限：${this.hasCameraPermission ? '已授权' : '未授权'}\n\n当前位置：${this.currentLocation.address || '未获取'}\n\n这是一个演示系统，数据仅在当前设备保存`,
        showCancel: false
      });
    },
    
    // 打开扫码功能
    openScanCode() {
      if (!this.hasCameraPermission) {
        uni.showModal({
          title: '需要相机权限',
          content: '请先授权相机权限以使用扫码功能',
          success: (res) => {
            if (res.confirm) {
              this.requestCameraPermission();
            }
          }
        });
        return;
      }
      
      // 调用微信小程序的扫码API
      uni.scanCode({
        success: (res) => {
          uni.showModal({
            title: '扫码结果',
            content: `扫描成功！\n类型：${res.scanType}\n结果：${res.result}`,
            showCancel: false
          });
        },
        fail: (err) => {
          console.error('扫码失败:', err);
          if (err.errMsg !== 'scanCode:fail cancel') {
            uni.showToast({ title: '扫码失败', icon: 'none' });
          }
        }
      });
    },
    
    // 打开联系人
    openContacts() {
      uni.navigateTo({
        url: '/pages/demo/contacts'
      });
    },
    
    // 打开日历
    openCalendar() {
      uni.navigateTo({
        url: '/pages/demo/calendar'
      });
    },
    
    // 打开备忘录
    openNotes() {
        // 使用redirectTo而不是navigateTo，保持底部栏显示
        uni.redirectTo({
          url: '/pages/demo/notes'
        });
      },
      
      // 显示个人资料提示
      showProfileTip() {
        uni.showToast({
          title: '我的功能暂未开放',
          icon: 'none'
        });
      },
    
    // 打开文件
    openFiles() {
      uni.navigateTo({
        url: '/pages/demo/files'
      });
    },
    
    // 打开日程
    openSchedule() {
      // 使用redirectTo而不是navigateTo，保持底部栏显示
      uni.redirectTo({
        url: '/pages/demo/schedule'
      });
    },
    
    // 打开个人资料页
    navigateToProfile() {
      // 使用redirectTo而不是navigateTo，保持底部栏显示
      uni.redirectTo({
        url: '/pages/demo/profile'
      });
    },
    
    // 打开单个文件
    openFile(file) {
      uni.showToast({ title: `打开文件：${file.name}`, icon: 'none' });
    },
    
    // 打开单个笔记
    openNote(note) {
      uni.showToast({ title: `打开笔记：${note.title}`, icon: 'none' });
    }
  }
};
</script>

<style scoped>
/* 通用样式 */
.demo-container {
  height: 100vh;
  background: linear-gradient(135deg, #f5f7fa 0%, #e4eaf1 100%);
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
}

/* 登录界面 */
.login-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-top: 120rpx;
  height: 100vh;
  box-sizing: border-box;
  background-color: #ffffff;
}

.logo {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 80rpx;
}

.logo-text {
  font-size: 120rpx;
  margin-bottom: 20rpx;
}

.app-name {
  font-size: 40rpx;
  font-weight: 600;
  color: #333333;
}

.login-content {
  width: 90%;
  background-color: #ffffff;
  border-radius: 30rpx;
  padding: 60rpx 40rpx;
  box-shadow: 0 8rpx 32rpx rgba(0, 0, 0, 0.05);
  border: 1rpx solid #eeeeee;
}

.login-wx {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-bottom: 40rpx;
}

.wechat-icon {
  width: 120rpx;
  height: 120rpx;
  margin-bottom: 20rpx;
}

.login-text {
  font-size: 32rpx;
  color: #333333;
  font-weight: 600;
}

.login-desc {
  font-size: 26rpx;
  color: #666666;
  text-align: center;
  line-height: 1.6;
  margin-bottom: 50rpx;
}

.permissions-hint {
  display: block;
  text-align: center;
  font-size: 24rpx;
  color: #999999;
  margin-top: 20rpx;
}

.btn {
  width: 100%;
  height: 90rpx;
  line-height: 90rpx;
  font-size: 32rpx;
  border-radius: 45rpx;
  margin: 10rpx 0;
}

.btn.primary {
  background-color: #07c160;
  color: #ffffff;
}

.btn.small {
  width: 120rpx;
  height: 60rpx;
  line-height: 60rpx;
  font-size: 24rpx;
  margin: 0;
}

/* 主应用界面 */
.app-container {
  height: 100vh;
  display: flex;
  flex-direction: column;
  background: linear-gradient(135deg, #f5f7fa 0%, #e4eaf1 100%);
}

.header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 30rpx 40rpx;
  background-color: #07c160;
  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
}

.header-title {
  font-size: 36rpx;
  font-weight: 600;
  color: #ffffff;
}

.header-actions {
  display: flex;
  align-items: center;
}

.action-btn {
  margin-right: 20rpx;
}

.action-icon {
  font-size: 40rpx;
  color: #ffffff;
}

.user-avatar {
  width: 60rpx;
  height: 60rpx;
  border-radius: 50%;
  overflow: hidden;
}

.avatar-img {
  width: 100%;
  height: 100%;
}

.content {
  flex: 1;
  padding: 30rpx 40rpx;
  overflow-y: auto;
  background: linear-gradient(135deg, #f5f7fa 0%, #e4eaf1 100%);
}

/* 用户信息卡片 */
.user-card {
  display: flex;
  align-items: center;
  background: linear-gradient(135deg, #ffffff 0%, #f5f5f5 100%);
  border-radius: 24rpx;
  padding: 30rpx;
  margin-bottom: 30rpx;
  box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.08);
  border: 1rpx solid #eeeeee;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

/* 位置信息展示样式 */
.location-display {
  background: linear-gradient(135deg, #ffffff 0%, #f5f5f5 100%);
  border-radius: 24rpx;
  padding: 25rpx 30rpx;
  margin-bottom: 30rpx;
  box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.08);
  border: 1rpx solid #eeeeee;
}

.location-header {
  display: flex;
  align-items: center;
  margin-bottom: 15rpx;
}

.location-icon {
  font-size: 28rpx;
  margin-right: 12rpx;
  color: #07c160;
}

.location-title {
  font-size: 28rpx;
  font-weight: 600;
  color: #333333;
}

.location-address {
  font-size: 26rpx;
  color: #666666;
  line-height: 1.5;
}

.user-card:active {
  transform: scale(0.98);
  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
}

.card-avatar {
  width: 100rpx;
  height: 100rpx;
  border-radius: 50%;
  margin-right: 20rpx;
}

.card-info {
  flex: 1;
}

.card-name {
  font-size: 32rpx;
  font-weight: 600;
  color: #333333;
  display: block;
  margin-bottom: 10rpx;
}

.card-welcome {
  font-size: 26rpx;
  color: #666666;
}

/* 权限卡片样式 */
.permissions-card {
  background: linear-gradient(135deg, #ffffff 0%, #f5f5f5 100%);
  border-radius: 24rpx;
  padding: 30rpx;
  margin-bottom: 30rpx;
  box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.08);
  border: 1rpx solid #eeeeee;
}

.permissions-header {
  display: flex;
  align-items: center;
  margin-bottom: 20rpx;
}

.permissions-icon {
  font-size: 32rpx;
  margin-right: 12rpx;
}

.permissions-title {
  font-size: 32rpx;
  font-weight: 600;
  color: #333333;
}

.permissions-list {
  display: flex;
  flex-direction: column;
  gap: 15rpx;
}

.permission-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20rpx;
  background-color: #f8f8f8;
  border-radius: 16rpx;
  border: 1rpx solid #eeeeee;
}

.permission-icon {
  font-size: 36rpx;
  margin-right: 16rpx;
}

.permission-name {
  font-size: 28rpx;
  font-weight: 500;
  color: #333333;
  flex: 1;
}

.permission-desc {
  display: block;
  font-size: 22rpx;
  color: #999999;
  margin-top: 4rpx;
}

.permission-btn {
  background: linear-gradient(135deg, #07c160 0%, #06b358 100%);
  color: white;
  border-radius: 10rpx;
  font-size: 24rpx;
  height: 60rpx;
  line-height: 60rpx;
  box-shadow: 0 2rpx 8rpx rgba(7, 193, 96, 0.2);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.permission-btn:active {
  transform: scale(0.95);
  box-shadow: 0 1rpx 4rpx rgba(7, 193, 96, 0.1);
}

/* 快捷功能样式 */
.shortcuts-section {
  margin-bottom: 30rpx;
}

.shortcuts-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 20rpx;
  margin-top: 15rpx;
}

.shortcut-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #ffffff 0%, #f5f5f5 100%);
  border-radius: 24rpx;
  padding: 40rpx 20rpx;
  box-shadow: 0 4rpx 20rpx rgba(0, 0, 0, 0.08);
  border: 1rpx solid #eeeeee;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.shortcut-item:active {
  transform: scale(0.97);
  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
}

.shortcut-icon {
  font-size: 64rpx;
  margin-bottom: 20rpx;
}

.shortcut-name {
  font-size: 30rpx;
  font-weight: 500;
  color: #333333;
}

/* 日程部分 */
.schedule-section {
  background-color: #ffffff;
  border-radius: 20rpx;
  padding: 30rpx;
  margin-bottom: 30rpx;
  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
  border: 1rpx solid #eeeeee;
}

.section-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20rpx;
}

.section-title {
  font-size: 32rpx;
  font-weight: 600;
  color: #333333;
}

.section-more {
  font-size: 28rpx;
  color: #07c160;
}

.schedule-list {
}

.event-item {
  display: flex;
  align-items: center;
  padding: 20rpx 0;
  border-bottom: 1rpx solid #eeeeee;
}

.event-item:last-child {
  border-bottom: none;
}

.event-time {
  margin-right: 20rpx;
}

.event-hour {
  font-size: 26rpx;
  color: #07c160;
  font-weight: 600;
}

.event-content {
  flex: 1;
}

.event-title {
  font-size: 30rpx;
  color: #333333;
  display: block;
  margin-bottom: 5rpx;
}

.event-location {
  font-size: 24rpx;
  color: #999999;
}

.event-status {
  width: 10rpx;
  height: 10rpx;
  border-radius: 50%;
  margin-left: 20rpx;
}

.event-status.upcoming {
  background-color: #07c160;
}

.event-status.completed {
  background-color: #cccccc;
}

/* 最近文件 */
.files-section {
  background-color: #ffffff;
  border-radius: 20rpx;
  padding: 30rpx;
  margin-bottom: 30rpx;
  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
  border: 1rpx solid #eeeeee;
}

.files-list {
}

.file-item {
  display: flex;
  align-items: center;
  padding: 20rpx 0;
  border-bottom: 1rpx solid #eeeeee;
}

.file-item:last-child {
  border-bottom: none;
}

.file-icon {
  font-size: 40rpx;
  margin-right: 20rpx;
  color: #666666;
}

.file-info {
  flex: 1;
}

.file-name {
  font-size: 28rpx;
  color: #333333;
  display: block;
  margin-bottom: 5rpx;
}

.file-size {
  font-size: 24rpx;
  color: #999999;
}

.file-date {
  font-size: 24rpx;
  color: #999999;
}

/* 笔记部分 */
.notes-section {
  background-color: #ffffff;
  border-radius: 20rpx;
  padding: 30rpx;
  box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05);
  border: 1rpx solid #eeeeee;
}

.note-preview {
  padding: 20rpx;
  background-color: #f8f8f8;
  border-radius: 15rpx;
  position: relative;
}

.note-title {
  font-size: 30rpx;
  font-weight: 600;
  color: #333333;
  display: block;
  margin-bottom: 15rpx;
}

.note-content {
  font-size: 26rpx;
  color: #666666;
  line-height: 1.6;
  display: block;
  margin-bottom: 15rpx;
}

.note-date {
  font-size: 24rpx;
  color: #999999;
  display: block;
  text-align: right;
}

/* 底部导航 - 优化显示兼容性 */
.footer-nav {
  display: flex;
  justify-content: space-around;
  align-items: center;
  height: 120rpx;
  background-color: #ffffff;
  box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.05);
  border-top: 1rpx solid #eeeeee;
  /* 固定在底部并适配不同设备 */
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 999;
}

/* 为内容区域添加底部内边距，防止被导航栏遮挡 */
.content {
  padding-bottom: 140rpx !important;
}

.nav-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 10rpx 0;
  color: #999999;
}

.nav-item.active {
  color: #07c160;
}

.nav-icon {
  font-size: 40rpx;
  margin-bottom: 8rpx;
}

.nav-text {
  font-size: 24rpx;
}
</style>